<template>
  <div class="accent">
    <el-tabs>
      <el-form :model="formes" ref="pwdFormRef">
        <el-form-item label="审核状态">
          <el-select v-model="formes.region" placeholder="审核状态">
            <el-option label="已通过" value="Pass"></el-option
            ><el-option label="未通过" value="Reject"></el-option>
            <el-option label="更新待审核" value="Update"></el-option>
            <el-option label="提交待审核" value="Submit"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="注册时间" class="hitemee">
           <el-date-picker
            v-model="formes.value1"
            type="month"
            placeholder="选择日期"
          >
          </el-date-picker>
        </el-form-item>
        <el-button class="assion" @click="hinwt">搜索</el-button>
        <el-button class="action" @click="hreset">重置</el-button>
      </el-form>
      
      <el-table :data="userinfo"  style="width: 100%">
        <el-table-column
          prop="realName"
         
          label="真实姓名"
          width="180"
        >
        </el-table-column>
          <el-table-column
          prop="phone"
         
          label="手机号"
          width="230"
        >
        </el-table-column>
           <el-table-column
           prop="type"
          label="工种"
          width="230"
        >
        <template v-slot="{row}">
          {{fundeaster(row.type)}}
        </template>
        </el-table-column>
        <el-table-column
          prop="status"
         
          label="状态"
          style="width: 30%"
      
        >
          <template v-slot="{ row }">
            <el-tag
              :type="row.status === 'Pass' ? 'success' : 'info' && row.status === 'Reject' ? 'danger':'info'"
              disable-transitions
            >
              {{ fundasdr(row.status) }}
            </el-tag>
          </template>
        </el-table-column>
           <el-table-column
          prop="userDesc"
          label="审核理由"
          width="270"
        >
        </el-table-column>
        <el-table-column
          prop="applyTime"
          label="发布时间"
        >
        </el-table-column>
        <el-table-column fixed="right" label="操作" style="width: 30%">
          <template v-slot="{ row }">
            <el-button type="text" size="small" @click="tio(row)"
              >查看</el-button
            >
          </template>
        </el-table-column>
      </el-table>
        <el-pagination
       class="lyx"
      @size-change="handleSizeChange"
      @current-change="handleCurrentChange"
        :page-sizes="[10, 5, 15, 20]"
        :current-page.sync="q.index"
        :page-size="2"
      layout="total, sizes, prev, pager, next, jumper"
      :total="total">
    </el-pagination>
    </el-tabs>
  </div>
</template>

<script>
import { useraudit } from "@/api/user";
import  employeesConst  from "@/constant/employees";
const hireTypeMap = {};
const hireTypecon = {};

employeesConst.hireTypese.forEach((item) => {
  hireTypeMap[item.status] = item.value;
});

employeesConst.hireTypecon.forEach((item) => {
  hireTypecon[item.type] = item.value;
});

export default {
  data() {
    return {
      total:0,
      userinfo: [],
      info:[],
      formes: {
        value1: "",
        region: "",
        sg:''
       
      },
      q: {
        index: 1,
        size: 10,
        status: null,
        startTime:'',
        endTime:''
      },
    };
  },
  created() {
    this.loacheng();
  },
  methods: {
    // 数据渲染
    async loacheng() {
      const res = await useraudit(this.q);
      this.userinfo = res.data.data;
       
          // this.list[i].region = this.info[i].county
          // this.list[i].region.city = this.info[i].city
          // this.list[i].region.county = this.info[i].county
        
      this.total = res.data.count-0

    },
    // 查看状态
    filterTag(value, row) {
      return row.name === value;
    },
    // 点击搜索
    hinwt() {
      // this.loacheng()
      if(this.formes.value1){
  //  this.timer = []
        let date = new Date(this.formes.value1);
       let Yr = date.getFullYear()
      // this.timer.push(Yr)
       let Mn = date.getMonth()+1
      
      if(Mn<10){
        Mn="0"+Mn
      }

      // this.timer.push(Mn)
      // this.timer.push(My)
      this.formes.value1 = Yr+'-'+Mn+'-'+'01'+" "+'00'+':'+'00'+':'+'00'
      this.formes.sg = Yr+'-'+Mn+'-'+'31'+" "+'23'+':'+'59'+':'+'59'
      // this.form.value1 = this.timer.join('-') +''+''+'00'+':'+'00'+':'+'00'
        this.q.startTime = this.formes.value1
        this.q.endTime = this.formes.sg
     
       }
  
      if(this.formes.region != ''){
        this.q.status = this.formes.region
      }
         this.q.index = 1
        this.loacheng()
     
   
    },
    // 查看详细
    tio(row) {
      // console.log(row);
      this.$router.push({
        path: "/home/enter",
        query: { row },
      });
    },
    // 重置
    hreset() {
      this.q.index = 1
      this.formes.value1 = "";
      this.formes.region = "";
      this.q.startTime = ''
      this.q.endTime = ''
      this.q.status = null
      this.loacheng();
    },
    // 分页
    handleCurrentChange(index) {
      this.q.index = index;
      this.loacheng();
    },
    handleSizeChange(size) {
      this.q.size = size;
      this.loacheng();
    },
    fundasdr(code) {
      return hireTypeMap[code];
    },
    fundeaster(code){
      return hireTypecon[code]
    }
  },
};
</script>

<style scoped>
.accent {
  background-color: #fff;
  padding: 0 30px;
}
.el-form-item {
  margin-left: 20px;
  display: inline-block;
  width: 300px;
}
.hitemee {
  width: 350px;
}
.el-button--text {
  color: #ff7144;
}
.assion {
   background: linear-gradient(90deg, #ff7144 0%, #ff7144 100%);
   border: 1px solid #ff7144;
  color: #fff;
}
.action:hover {
  background-color: rgb(255, 248, 243);
  color: #ff7144;
  border: 1px solid rgb(255, 190, 132);
}
.action:focus {
  background-color: rgb(255, 248, 243);
  color: #ff7144;
  border: 1px solid rgb(255, 190, 132);
}
</style>
